.app-badge {
	height: 100%;
	.top-box {
		background-color: #4294ff;
		i {
			font-size: 16px;
			font-weight: bold;
		}
	}
	.content-box {
		overflow: auto;
		.head-num-bg {
			background: #4294ff url(../../assets/images/index-card-badge.png) right
				center no-repeat;
			background-size: contain;
			.head-num-box {
				padding: 10px 15px;
				background-color: rgba(66, 148, 255, 0.8);
				.title-box {
					h2 {
						font-weight: normal;
						font-size: 22px;
					}
					p {
						color: #aad9f7;
						font-weight: bold;
					}
				}

				.num-box {
					h3 {
						font-weight: normal;
						color: #aad9f7;
					}
					p {
						text-align: center;
					}
				}
			}
		}
		.badges-box {
			flex-wrap: wrap;
			justify-content: space-evenly;
			overflow: auto;
			.item {
				margin-top: 20px;
				text-align: center;
				img {
					width: 100px;
					height: 100px;
					object-fit: cover;
				}
			}
		}
	}

	.mask {
		align-items: center;
		text-align: center;
		height: 100%;
		width: 100%;
		position: fixed;
		top: 0;
		z-index: 1;
		background-color: white;
		display: none;
		.top-box {
			width: 100%;
			text-align: left;
		}
		.text-box {
			.text-title {
				font-size: 22px;
			}
			.min-text {
				color: #429bff;
			}
		}
		.text-date {
			margin-bottom: 120px;
			color: #429bff;
		}
	}
}
